import { LitElement, html, css } from "lit";
import { customElement, property } from "lit/decorators.js";

@customElement("my-lit-component")
export class MyLitComponent extends LitElement {
  static styles = css`
    :host {
      display: block;
      color: blue;
    }
  `;

  @property({ type: String })
  msg = "";

  @property({ type: Array })
  list = [];

  render() {
    console.log("[ this.list ] >", this.list);
    return html`<div>
      <h1>${this.msg}</h1>
      <p>Hello from Lit!</p>
    </div>`;
  }
}
